<template>
	<div>
		<div class="type">
			<div class="typeevery typepic1">
				<div class="typeprice">开始练习</div>
			</div>
			<div class="typeevery typepic2">
				<div class="typeprice">开始练习</div>
			</div>
		</div>
		<div class="type">
			<div class="typeevery typepic3">
				<div class="typeprice">开始练习</div>
			</div>
			<div class="typeevery typepic4">
				<div class="typeprice">开始练习</div>
			</div>
		</div>
		<div class="type type1" v-if="subject==3||subject=='3'">
			<div class="typeevery typepic5">
				<div class="typeprice">开始练习</div>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				subject:'',  //科目
				share:0,  
			};
		},
		methods:{
			
		},
		mounted() {
			var that = this;
			that.subject=that.$route.query.subject;
			that.share=that.$route.query.share;   //0不是分享   1分享
		}
	}
</script>

<style>
.type{
	width: 6.9rem;
	margin: .3rem auto;
	display: flex;
	justify-content: space-between;
}
.type1{
	justify-content: flex-start !important;
}
.typeevery{
	position: relative;
	width: 3.3rem;
	height: 3.8rem;
	
}
.typepic1{
	background: url('../../../assets/image/typeA1.png') no-repeat;
	color: #F65732;
	background-size:100%;
}
.typepic2{
	background: url('../../../assets/image/typeA2.png') no-repeat;
	color: #2C33FC;
	background-size:100%;
}
.typepic3{
	background: url('../../../assets/image/typeA3.png') no-repeat;
	color: #1F5BF8;
	background-size:100%;
}
.typepic4{
	background: url('../../../assets/image/typeB1.png') no-repeat;
	color: #5A45D0;
	background-size:100%;
}
.typepic5{
	background: url('../../../assets/image/typeB2.png') no-repeat;
	color: #5A45D0;
	background-size:100%;
}
.typeprice{
	position: absolute;
	width: 2.7rem;
	top: 2.8rem;
	background: #fff;
	border-radius: 0.04rem;
	line-height: .53rem;
	left: 50%;
	margin-left: -1.35rem;
	text-align: center;
}

</style>
